<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
</h:head>

<h:body>
	<ui:composition
		template="/WEB-INF/templates/registrationFormTemplate.xhtml">

		<ui:define name="content">

			<div style="width: 100%; height: 300px; border: 1px solid grey;">

				<h:form>
					<h:panelGrid columns="1" width="700"
						style="margin-left:auto;margin-right:auto;">
						
						<h:panelGroup>
							<h3 style="font-weight: bold; color: green;">
								<h:outputText value="#{msg['profile.registration.header']}" />
							</h3>
						</h:panelGroup>
						
						<hr />

						<h:panelGrid columns="3" border="0" title="Registration Form"
							frame="above"
							columnClasses="lableCol,componentCol,validationMsgCol">

							<h:outputLabel value="Email Id" />
							<h:inputText id="emailId" value="#{reg.student.emailId}"
								style="width:150px;" size="150"
								requiredMessage="#{msg.emailIdValidation}">
								<f:validateRequired for="emailId" />
								<f:validateLength minimum="8" maximum="150" />
							</h:inputText>

							<h:message for="emailId" />

							<h:outputLabel value="Password" />
							<h:inputSecret id="password" value="#{reg.password}"
								style="width:150px;" size="20"
								requiredMessage="#{passwordRequired}">
								<f:validateRequired for="password" />
								<f:validateLength minimum="8" maximum="20" />
							</h:inputSecret>
							<h:message for="password" />

							<h:outputLabel value="Current Standard" />
							<h:selectOneMenu id="currentStandard">
								<f:selectItems value="#{reg.standards}"
									var="v" itemLabel="#{v.enumValue}" itemValue="#{v.enumId}" />
							</h:selectOneMenu>
							<h:message for="currentStandard" />

							<h:outputLabel value="Name" />
							<h:panelGroup>
								<h:inputText id="firstName" value="#{reg.student.firstName}"
									requiredMessage="First Name is required">
									<f:validateRequired for="firstName" />
								</h:inputText>
								<h:inputText id="middleName" value="#{reg.student.middleName}" />
								<h:inputText id="lastName" value="#{reg.student.lastName}" />
							</h:panelGroup>
							<h:message for="firstName" />

							<h:outputLabel value="Gender" />
							<h:selectOneRadio id="gender" value="#{reg.student.gender}"
								requiredMessage="#{msg.genderRequired}">
								<f:selectItem itemLabel="Male" itemValue="m" />
								<f:selectItem itemLabel="Female" itemValue="f" />
								<f:validateRequired for="gender" />
							</h:selectOneRadio>
							<h:message for="gender" />


							<h:outputLabel value=" " />
							<h:commandButton value="Register Student"
								action="#{reg.saveProfile()}" />
						</h:panelGrid>
						
						<hr/>
						
					</h:panelGrid>
				</h:form>
			</div>

		</ui:define>

		<ui:define name="footer">
		
			Welcome to our marriage portal
		</ui:define>

	</ui:composition>
</h:body>

</html>